<%@ page contentType="text/html;charset=UTF-8"%>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<html class=" -webkit-">

	<head>
		<meta charset="utf-8">
		<title>杰利联合</title>
		<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
		<meta content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" name="viewport">
		<meta content="application/xhtml+xml;charset=UTF-8" http-equiv="Content-Type">
		<meta content="no-cache,must-revalidate" http-equiv="Cache-Control">
		<meta content="no-cache" http-equiv="pragma">
		<meta content="0" http-equiv="expires">
		<meta content="telephone=no, address=no" name="format-detection">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
		<link rel="stylesheet" type="text/css" href="${ctxStatic}/jiu/css/mobile_module.css?v=1493085388" media="all">
		<script type="text/javascript" src="${ctxStatic}/jiu/js/jquery-2.0.3.min.js"></script>
		<script type="text/javascript" src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
		<script type="text/javascript" src="${ctxStatic}/jiu/js/prefixfree.min.js?v=1493085388"></script>
		<script type="text/javascript" src="${ctxStatic}/jiu/js/dialog.js?v=1493085388"></script>
		<script type="text/javascript" src="${ctxStatic}/jiu/js/flipsnap.min.js?v=1493085388"></script>
		<script type="text/javascript" src="${ctxStatic}/jiu/js/mobile_module.js?v=1493085388"></script>
		<link href="${ctxStatic}/jiu/css/common.css?v=1493085388" rel="stylesheet" type="text/css">
		<style>
				
			.yin{
				
				background-color:rgba(0, 0, 0, 0.5);								
				width: 100%;
				height: 100%;								
				position: fixed;
				top: 0;
				left: 0;
				z-index: 9999;
				display: none;
			}
			.loading{
				line-height: 50px;
				width: 200px;
				height: 50px;
				display: none;
				background-color: rgba(23, 21, 21, 0.51);
				position: fixed;
				top: 50%;
				left: 50%;
				margin: -25px 0 0 -100px;
				z-index: 10000;				
				border-radius: 5px;
				-webkit-border-radius: 5px;
				color: #fff;
				text-align: center;
			}
		</style>
	</head>

	<body class="withFoot">
		<form:form id="inputForm" modelAttribute="jiuOrder" action="${ctxFront }/jiu/completeUploadPic" method="post" class="form-horizontal" enctype="multipart/form-data">
		<input type="hidden" name="orderId" value="${jiuOrder.id}"/>
		<div class="container">
			<div class="order_detail">
				<p class="name">订单号：${jiuOrder.orderNo}</p>
				<p class="name">传图设计师：${jiuOrder.designName}</p>
				<p class="name">上传凭证：<input type="file" name="picfile"/></p>
				<%-- <p class="name"></p>
				<p class="name">上传凭证：<input type="file" name="picfile" htmlEscape="false"/> </p> --%>
				<!-- <p class="name">备注：<input type="text" name="remark" value=""></p> -->
				<div class="order_detail_left">
					<img src="${ctxUser }/jiu/${jiuOrder.manufactorLogo}" height="80px" width="80px" />
				</div>
				<div class="order_detail_right" style="width: 66%;">
					<p>${jiuOrder.manufactorName}</p>
					<p style="margin-top: 5px;">购买数量：X ${jiuOrder.orderNum}</p>
					<div class="orange">价格：${jiuOrder.totalPrice}积分</div>
					<!-- <button class="btn yellow_btn" onclick="javascript:location.href='http://jiujiu.hbweiyinqing.cn/index.php?s=/addon/PoitOrder/Wap/orderComplete/id/8905/shop_id/1.html';">去完成</button> -->
					<input  class="btn yellow_btn" type="submit" value="上传凭证"/>
				</div>
			</div>
		</div>
		
		<!-- 底部导航 -->
		<%@ include file="/WEB-INF/views/modules/jiuFront/footer.jsp"%>
		
		<div class="yin">
		</div>
		<div class="loading" >			
			 <img alt="" src="${ctxStatic}/jiu/img/icon32_loading_dark.gif">正在提交，请稍后...	
		</div>
		</form:form>
		<!-- <script>
			$(document).ready(function() {
				$('.btn').click(function() {
					$('.loading').fadeIn().delay(3000).fadeOut();
					$('.yin').fadeIn(300).delay(3000).fadeOut();
				})
			});	
			
			window.alert = function(name){
				  var iframe = document.createElement("IFRAME");
				  iframe.style.display="none";
				  iframe.setAttribute("src", 'data:text/plain,');
				  document.documentElement.appendChild(iframe);
				  window.frames[0].window.alert(name);
				  iframe.parentNode.removeChild(iframe);
				 };
				 
				 window.confirm = function (message) {
				   var iframe = document.createElement("IFRAME");
				   iframe.style.display = "none";
				   iframe.setAttribute("src", 'data:text/plain,');
				   document.documentElement.appendChild(iframe);
				   var alertFrame = window.frames[0];
				   var result = alertFrame.window.confirm(message);
				   iframe.parentNode.removeChild(iframe);
				   return result;
				 };
		</script>

		<script>
		var tag=0;
			function complete() {
				$('.loading').show();
				if(tag==1){
					return;
				}
				var remarks = $('input[name=remark]').val();
				tag=1;
				 $.getJSON("${ctxFront }/jiu/complete",{orderId:"${jiuOrder.id}",remarks:remarks}, function(data){
                     alert(data.message);
                     if(data.msg=='success'){
                    	 window.location.href="${ctxFront }/jiu/dingdan?uid=${jiuOrder.userId}&type=1&v="+Math.random();
                     }
                });
			}
		</script> -->
	</body>

</html>